import {useModel} from '@@/exports';
import {PlusOutlined} from '@ant-design/icons';
import type {ActionType, ProColumns} from '@ant-design/pro-components';
import {ProTable} from '@ant-design/pro-components';
import {Button, message, Popconfirm} from 'antd';
import React, {useRef, useState} from 'react';
import {
  deleteWorkSheetPreserveUsingDELETE,
  listWorkSheetPreserveUsingGET
} from "@/services/model/workSheetPreserveController";
import AddOrEditModel from "@/pages/WorkSheetPreserve/component/AddOrEditModel";

const Attendance: React.FC = () => {
  const {initialState} = useModel('@@initialState');
  const actionRef = useRef<ActionType>();
  const [selectProductValue, setSelectProductValue] = useState('');
  const [selectWsSerialNumberValue, setSelectWsSerialNumberValue] = useState('');
  const [isModalOpen, setIsModalOpen] = useState(false);
  const [saveType, setSaveType] = useState('');
  const [editRecord, setEditRecord] = useState({} as API.WorkSheetPreserveDTO);

  const initWorkSheetPreserveList = async () => {
    const result = await listWorkSheetPreserveUsingGET();
    return {
      data: result.data
    };
  }

  const onDelete = async (id: number) => {
    const result = await deleteWorkSheetPreserveUsingDELETE({
      id,
      currentUserId: initialState?.currentUser?.id,
    });
    if (result.code === 0 && result.data) {
      message.success('删除成功');
      actionRef.current?.reload();
    } else {
      message.warning(result.message);
    }
  };

  const proColumns: ProColumns<API.WorkSheetPreserveDTO>[] = [
    {
      title: '序号',
      key: 'index',
      render: (dom, entity, index) => (
        index + 1
      ),
    },
    {
      title: '产品代码',
      key: 'productName',
      dataIndex: 'productName',
      valueType: 'text',
    },
    {
      title: '工单号',
      key: 'wsSerialNumber',
      dataIndex: 'wsSerialNumber',
      valueType: 'text',
    },
    {
      title: '是否隐藏',
      key: 'hidden',
      dataIndex: 'hidden',
      valueType: 'select',
      valueEnum: {
        1: {
          text: '是',
          status: 'Success',
        },
        0: {
          text: '否',
          status: 'Error',
        },
      },
    },
    {
      title: '操作',
      valueType: 'option',
      render: (text, record) => [
        <a
          key="editable"
          onClick={() => {
            console.log(record);
            setSelectWsSerialNumberValue(record.wsSerialNumber ? record.wsSerialNumber : '');
            setSelectProductValue(record.productName ? record.productName : '');
            setEditRecord(record)
            setIsModalOpen(true);
            setSaveType('edit')
          }}
        >
          编辑
        </a>,
        <Popconfirm
          key={'onDelete'}
          title="你想要删除这条数据吗"
          onConfirm={() => {
            onDelete(record.id)
          }}
          okText="Yes"
          cancelText="No"
        >
          <a key="deletable">删除</a>
        </Popconfirm>,
      ],
    },
  ];

  return (
    <div>
      <div style={{display: "flex", justifyContent: "space-between", marginBottom: '5px'}}>
        <Button
          type="primary"
          onClick={() => {
            setSelectProductValue('');
            setSelectWsSerialNumberValue('')
            setEditRecord({} as API.WorkSheetPreserveDTO)
            setIsModalOpen(true);
            setSaveType('save')
          }}
          icon={<PlusOutlined/>}
        >
          新增 工单维护信息
        </Button>
      </div>

      <ProTable<API.WorkSheetPreserveDTO>
        rowKey="id"
        scroll={{y: 'calc(100vh - 205px)'}}
        actionRef={actionRef}
        headerTitle="工单维护配置表格"
        columns={proColumns}
        search={false}
        pagination={false}
        request={() => initWorkSheetPreserveList()}
      />

      <AddOrEditModel saveType={saveType}
                      isModalOpen={isModalOpen}
                      onCancel={() => setIsModalOpen(false)}
                      initProductCode={selectProductValue}
                      initWorkOrderNo={selectWsSerialNumberValue}
                      actionRef={actionRef}
                      editRecord={editRecord}
      />

    </div>
  );
};

export default Attendance;
